<template>
    <div class="main">
        <Nav>
            <div slot="left" @click="goBack"> &lt; </div>
            <div slot="center">解决方案-评估</div>
            <div slot="right" >···</div>
        </Nav>
        <div class="bgcimage">
            <div class="item1 item" @click="handleClick(0)"></div>
            <div class="item2 item" @click="handleClick(1)"></div>
            <div class="item3 item" @click="handleClick(2)"></div>
            <div class="item4 item" @click="handleClick(3)"></div>
            <div class="item5 item" @click="handleClick(4)"></div>
            <div class="item6 item" @click="handleClick(5)"></div>
            <img src="@/assets/images/base-images/评估.png" alt="">
            <div class="select">
                <div>
                <img src="~@/assets/images/base-images/箭头.png" alt="">
                </div>
                <div>请先选择部位进行评估</div>
            </div>
        </div>
    </div>
</template>

<script>
import {request} from '@/network/request.js';
import {debounce} from '@/components/common/common.js';
import Nav from '@/components/common/Nav.vue';
    export default {

        components: {
            Nav,
            
        },

        methods: {
            handleClick(index){
                this.$router.push({
                    path:'/assessment/scrollmain',
                    query:{
                        index
                    }
                })
                
            },
            goBack() {
                this.$router.go(-1); 
            },

        },
    }
</script>

<style scoped>
.main{
    height: calc(100% - 64px);
}
.bgcimage {
    margin-top:64px ;
    position: relative;
}
.bgcimage .item{
    position: absolute;
    width: 15px;
    height: 15px;
    background-color: rgba(255, 255, 255, .0);
    border: 2px solid red;
    border-radius: 50%;
    cursor: pointer;
}
.bgcimage .item1{
    left: 178px;
    top: 124px;

}
.bgcimage .item2{
    left: 210px;
    top: 133px;

}
.bgcimage .item3{
    left: 178px;
    top:220px;
}
.bgcimage .item4{
    left: 150px;
    top:230px;
}
.bgcimage .item5{
    left: 205px;
    top:345px;
}
.bgcimage .item6{
    left: 150px;
    top:440px;
}
.bgcimage img{
    vertical-align: middle;
    width: 375px;
    height: 603px;
}

</style>